// https://developers.facebook.com/docs/reference/plugins/like/

$(function() {
	var _set = null;
	var _collection = null;
	var _url = window.location;
	var _first = true;
	var _captionWidth = 426;
	var _modal = false;
	var _timer = null;
	var $header = $('#header');
	var $bar = $('#bar');
	var _barWidth = $('#progress').width() - 2;
	var $book = $('#book');
	var $textHead = $('#text h1');
	var $caption = $('#caption');
	var $pageCount = $('.page-count');
	var $dateTaken = $('#date-laken');
	var $flickrLink = $('#flickr-link');
	var $mapLink = $('#map-link');
	var $image = $('#image');
	
	ti.alert = function(message, title) {
		if (title) { message = '<strong>' + title + '</strong><br/>' + message; }
		$('#message').append('<code>' + message + '</code>');
	}
	ti.formatText = function(text) {
		return text;
		/*
		return text
			.replace(/(\w)'/g, '$1&rsquo;')
			.replace(/\b'(\w)/g, '&lsquo;$1');
			//.replace(/(\w)"/g, '$1&rdquo;');
			//.replace(/\b"(\w)/g, '&ldquo;$1');
		*/
	}
	
	if (_url.pathname && _url.pathname != '/') {
		flickr.getSet(_url.pathname.replace(/\//g, ""), function(s) {
			var $progress = $('#progress');
			$progress.show();
			_set = s;
			_set.screenWidth = screen.width;
			_set.windowWidth = $(window).width();
			_set.gutterWidth = _captionWidth + 25;
			_set.setSizeFor(enum.sizeFor.screen);
			$('.title').html(_set.title);
			_set.progress = function(percent) {
				var w = Math.round(percent * _barWidth);
				if (w < _barWidth) { $bar.css('width', w + 'px'); }
				else { $progress.fadeOut(); }
			}
			_set.loadDelay = 500;
			_set.beginLoad();
		});
	} else {
		flickr.getCollection(ti.collection, function(c) {
			formatCollection(c, $('<ul>'), true).appendTo($caption);
		});
	}
	
	// events -----------------------------------------------------------------
	
	$(window).keydown(function(e) {
		if (_modal) { return; }
		switch(e.keyCode) {
			case 39: next(); break;	 		// forward arrow
			case 37: previous(); break;		// back arrow
		}
	});
	$('#index-link').click(function(e) {
		var $index = $('#index');
		var dw = $(document).width();
		var dh = $(document).height();
		var left = Math.round((dw - $index.width()) / 2);

		e.preventDefault();		
		_modal = true;
		_set.pauseLoad();
		$('#bar-text').html('paused').css('color', '#fff');
		$('#mask')
			.css('width', dw + 'px')
			.css('height', dh + 'px')
			.css({ opacity: 0.5 })
			.show();
		$index.css('left', left + 'px').show();
	});
	
	$('#index .button').click(function(e) {
		e.preventDefault();	
		$('#bar-text').html('loading images').css('color', '#444');
		$('#mask').hide();
		$('#index').hide();
		_modal = false;
		_set.beginLoad();
	});
	
	$(window).resize(function(e) {
		if (_timer) { window.clearTimeout(_timer); }
		_timer = window.setTimeout(toggleResizer, 500);
	});
	
	$('#fit-link').click(function(e) {
		e.preventDefault();
		$(this).addClass('selected');
		$('#max-link').removeClass('selected');
		_set.setSizeFor(enum.sizeFor.window);
	});
	$('#max-link').click(function(e) {
		e.preventDefault();
		$(this).addClass('selected');
		$('#fit-link').removeClass('selected');
		_set.setSizeFor(enum.sizeFor.screen);
	});
	
	
	$image.click(function(e) { next(); });
	
	// private functions ------------------------------------------------------
	
	function toggleResizer() {
		if (screen.width - $(this).width() < 25) {
			// sizes are too similar to bother with image resizing
			$('#select-size').hide();
		} else {
			$('#select-size').show();
		}
	}
	
	function next() { if (_set.next()) { showPhoto(); } }
	function previous() { if (_set.previous()) { showPhoto(); } }
	
	function showPhoto() {
		$image.empty().hide();
		if (_first) {
			$dateTaken.show();
			$flickrLink.show();
			$('#copyright').show();
			_first = false;
		}
		_set.getCurrentPhoto(function(p) {
			var w = p.image.width + _captionWidth;
			$book.width(w).height(p.image.height + 60);
			$header.width(w);
			$textHead.html(_set.index + 1);
			$caption.html(p.title + '<p>' + p.description + '</p>');
			$pageCount.html((_set.index + 1) + ' of ' + _set.total);
			$dateTaken.html('taken ' + p.dateTaken);
			$flickrLink.attr('href', p.pageUrl);
			$image.append(p.image).fadeIn();
			if (p.mapUrl) {
				$mapLink.attr('href', p.mapUrl).show();
			} else {
				$mapLink.hide();
			}
		});
	}
	
	function formatCollection(c, $ul, root) {
		var $inner = (root) ? $ul :
			$('<ul>').appendTo(
				$('<li>')
					.addClass('collection')
					.append(c.title)
					.appendTo($ul)
			);
		
		for (var i in c.collections) {
			formatCollection(c.collections[i], $inner);
		}
		for (var i in c.sets) { formatSet(c.sets[i], $inner); }

		return $ul;
	}
	
	function formatSet(s, $ul) {
		$('<li>').append(s.link()).appendTo($ul);
	}
});